<template>
	<app-layout>
		<view class="con-box">
			<view class="" style="height: 470rpx; z-index: 0;">
				<!-- :style="{'margin-top': navHeight+'px'}" -->
				<image :src="imglist"
					style="width: 100%; height: 100%;z-index: 0;" @click="lookImage(imglist)">
				</image>
				<view class="dir-left-nowrap cross-center top-bg-nav">
					<!-- <view class="nav-text" @click="jumpTo('/plugins/mch_solitaire/index/index')">
					进入主页
				</view> -->
					<view class="nav-text" style="z-index: 9;" @click="gotoIndex">
						个人中心
					</view>
					<view class="" style="margin-left:24rpx ;" @click="changeBgPic" v-if="changeBg ==true">
						<text>更换背景</text>
					</view>
				</view>
				<view class="rota">
					<!-- :style="{top:'calc('+navHeight+'px + 24rpx)'}" -->
					<swiper style="height: 72rpx;" :autoplay="true" :interval="3000" :duration="1000" :circular="true"
						:vertical="true">
						<swiper-item v-for="(item, index) in avaterimg" :key="index">
							<view class="swiper-item cross-center">
								<image class="imgag" :src="item.useravatar" mode=""></image>
								{{ item.username }}
							</view>
						</swiper-item>
					</swiper>
				</view>
				<!-- <view class="rota" style="z-index: 100;background: none;" :style="{top:'calc('+navHeight+'px + 24rpx)'}">
			</view> -->
			</view>
			
				<!-- :style="{'margin-top': navHeight+'px','background-image':'url('+imglist+')'}" -->
				<!-- <view class=""> 
				个人信息
			</view> -->
				<!-- <view class="publisher"	@click="toMchlist"  >
					<image class="avatar" :src="solist.user.userInfo.avatar" mode=""></image>
					<view class="content u-line-2">
						<view>{{ solist.user.nickname }}</view>
					
					</view>
				</view>
				<view class="distrier" v-if="agent_info">
					<image class="avatar" :src="agent_info.user.userInfo.avatar" mode=""></image>
					<view class="content u-line-2">
						<view>{{ agent_info.user.nickname }}</view>						
					</view>
				</view>
				<view class="dir-left-nowrap" style="z-index: 2;">
					<button class="cur-share" plain @click="showshare = true">
						<image style="width: 60rpx;height: 60rpx;border-radius: 50%;" src="/static/image/share.png"
							mode="">
						</image>
					</button>
					<view class="cur-share" @click="genposter">
						<image style="width: 44rpx;height: 44rpx;border-radius: 50%;display: block;margin: 8rpx auto;"
							src="/static/image/poster.png" mode=""></image>
					</view>

				</view> -->
				<!--用户信息 -->
				<view class="per-info ">
					<!-- 头像和名称 -->
					<view class="userInfo">
						<image :src="solist.user.userInfo.avatar" mode="" @click="toMchlist" ></image>
						<view class="userName">
							<view>{{ solist.user.nickname }}</view>
						</view>
					</view>
					<view class="avatarUser" v-if="agent_info">
						<image :src="agent_info.user.userInfo.avatar" mode=""></image>
						
						<view class="fontview">{{ agent_info.user.nickname }}</view>
					
					</view>
					<!-- 分享按钮 -->
					<view class="sharebtn">
						<block v-for="(item,index) in btnArr" :key="index" >
							<view class="sDbtn" @click="checkShare(item.id)">
								<image :src="item.icon_url" mode="" ></image>
								<text>{{item.name}}</text>
							</view>
						</block>
					</view>
					
				</view>

			<view class="rea-soitem">
				<view class="" style="line-height: 2;">
					<view class="resa-title">
						{{ solist.title }}
					</view>
					<view class="resa-content">
						{{ solist.content }}
					</view>
				</view>
				<view class="" style="margin: 36rpx auto;">
					<app-rich-text :content="newDetail"></app-rich-text>
				</view>
				<view class="" style="margin: 36rpx auto;" @click="toMap">
					<text class="sol-address" :class="getTheme + '-s-back ' + getTheme + '-m-text ' + getTheme">
						{{ solist.mch.store.name }}
					</text>
				</view>
				<view class="">
					<!-- <u-ordinary-list :isShowAttr="true" :list="goodslist" :theme="getTheme" :list-style="-1">
				</u-ordinary-list> -->
					<view class="">
						<view class="list-two">
							<view class="list-two-item" v-for="(item, index) in goodslist" :key="index"
								@click="addattrshow(item)">
								<view class="list-two-image">
									<image v-if="item.detail.cover_pic" class="image" :src="item.detail.cover_pic"
										mode="">
									</image>
									<view class="list-two-miaosha" :class="getTheme + '-m-back ' + getTheme"
										v-if="item.detail.sign == 'miaosha'">
										<text v-if="item.msdetail.miaosha_status == 2">
											{{
                      item.msdetail.detail.miaoshaGoods.open_date +
                        " " +
                        item.msdetail.detail.miaoshaGoods.open_time +
                        ":00开始秒杀"
                    }}
										</text>
										<text v-else>秒杀商品</text>
									</view>
								</view>
								<!-- 商品展示列表 -->
								<view class="dir-top-nowrap" style="flex: 1;padding: 0 24rpx;width: 216rpx;">
									<!--  -->
									<view class="list-two-title u-line-2">{{item.detail.name}}</view>
									<view class="list-two-subtitle u-line-1">{{item.detail.subtitle}}</view>
									<text class="jbdikou"
										v-if='item.detail.forehead_integral !== "0.00"'>金币可抵{{ item.detail.forehead_integral }}</text>
									<view class="">
										<text class="rea-price" v-if="!item.ispechoice">


											<text v-if="item.detail.min_price">
												￥{{ item.detail.min_price }}
												<text
													v-if="item.detail.max_price != item.detail.min_price">~￥{{ item.detail.max_price }}
												</text>
											</text>
											<text v-else-if="item.detail.price_min">
												￥{{ item.detail.price_min }}
												<text
													v-if="item.detail.price_max != item.detail.price_min">~￥{{ item.detail.price_max }}
												</text>


											</text>
											<text v-else>￥{{ item.detail.price }}</text>
										</text>
										<text class="rea-price" v-else>
											￥{{ item.price }} / {{ item.attname }}
										</text>
										<!-- <text class="rea-spec"> /220规格</text> -->
									</view>
								</view>

								<view class="spechoi" v-if="!item.detail.goods_stock">
									<view style="background-color: #eeeeee;border-radius: 6rpx;color: #5f5f5f;"
										class="rea-choice">
										已抢光
									</view>
								</view>
								<view class="spechoi"
									v-if="item.detail.sign == 'miaosha' && item.msdetail.miaosha_status == 0">
									<view style="background-color: #eeeeee;border-radius: 6rpx;color: #5f5f5f;"
										class="rea-choice">
										已结束
									</view>
								</view>
								<view class="spechoi"
									v-if="item.detail.sign == 'miaosha' &&item.msdetail.miaosha_status == 2 ">
									<view style="background-color: #eeeeee;border-radius: 6rpx;color: #5f5f5f;"
										class="rea-choice">
										未开始
									</view>
								</view>
								<view class="spechoi" v-if="item.detail.goods_stock">
									<!-- <view class="" v-if="item.sign == 'miaosha'">
									秒杀商品
								</view> -->
									<!-- <view v-if="item.despec && !item.ispechoice" class="spechoice">
									<view class="rea-plus" @click="addspecnum(item)"></view>
								</view> item.detail.attr.length > 0 && -->
									<view v-if="
                    (!item.ispechoice && item.detail.sign != 'miaosha') ||
                      (item.detail.sign == 'miaosha' &&
                        item.msdetail.miaosha_status == 1 &&
                        !item.ispechoice)
                  " class="rea-choice">
										加入购物车
									</view>
									<view class="">
										<!-- <goods-attr :is_show_left="false" :is_must_left="false" :themeObject="themeObject"
										:goods="item.detail" v-model="item.attrShow" :checked="checked" @check="check">
									</goods-attr> -->
										<!-- <sol-attr-goods :goods="item.detail" :attrGroupList="item.detail.attr_groups"
										:theme="getTheme" :show="item.attrShow"></sol-attr-goods> -->
									</view>
									<view class="spechoice" v-if="item.ispechoice">
										<view class="rea-reduce" @click="reducenum(item)"></view>
										<view class="specn">{{ item.specnum }}</view>
										<view class="rea-plus" :class="item.stock <= item.specnum ? 'failed' : ''"
											@click="addnum(item)"></view>
									</view>
								</view>
							</view>
						</view>
						<view class="">
							<sol-attr-goods ref="stgoods" :goods="cugoods.detail"
								:attrGroupList="cugoods.detail.attr_groups" isShare :theme="getTheme"
								:show="cugoods.attrShow" isqjl @addSelect="addSelect" :addText="String('加入购物车')"
								:isjl='true'>
							</sol-attr-goods>
						</view>
					</view>
				</view>
			</view>
			<view class="cart-body" v-if="!isonlykan">
				<!-- 购物车 -->
				<view class="dir-left-nowrap step-carts">
					<!-- <view class="step-carts-icon" v-if="cartnum" @click="showgoods = true">
					<image class="step-carts-icon-img" src="/static/image/icon/cats.png" ></image>
					<view class="step-carts-cartnum">
						{{cartnum}}
					</view>
				</view> -->
					<!-- 点击加入购物车界面 -->
					<!-- <view class="step-carts-price" v-if="cartnum">
					￥{{cartprice.toFixed(2)}}
				</view> -->
					<view class="step-order">
						<view class="orderimage">
							<image src="../../../static/image/card/payorder.png" @click="gotoOrder"></image>
							<text>订单</text>
						</view>
					</view>
					<view class="step-order">
						<view class="orderimage" @click="showgoods = true">
							<image src="../../../static/image/icon/nav-icon-cart.png"></image>
							<view class="step-carts-cartnum">
								{{ cartnum }}
							</view>
							<text>购物车</text>
						</view>
					</view>
					<view class="step-dragon" @click="tosolitaire">
						<text v-if="cartprice == 0">￥0</text>
						<view v-else>￥{{ cartprice.toFixed(2) }}</view>
						<text>跟团购买</text>
					</view>
				</view>
				<!-- 底部空白 -->
				<view class="" style="width: 100%; height: 50rpx; background: white;"></view>
			</view>

			<!-- 界面轮播图 -->
			<view class="rea-advimg">
				<!-- 新增轮播图 -->
				<appSwiper :list="swiperList" name='icon_url' :borderRadius='16' :height="220"></appSwiper>
				<!--  <image
        class="advImg"
        :src="advimg"
        mode="widthFix"
        style="width: 100%;"
      ></image> -->
			</view>
			<!-- 最底部 -->
			<view class="rea-soitem rea-soitem1">
				<view class="rea-solitem">
					<view class="" v-for="(item, index) in fourbtn" :key="index" @click="jump(item)">
						<image class="rea-solitem-img" :src="item.icon_url" mode=""></image>
						<view class="">
							{{ item.name }}
						</view>
					</view>
					<!-- <view class="" @click="jumpTo('/plugins/mch_solitaire/index/index')">
					<image class="rea-solitem-img" src="/static/image/icon/icon-mch.png" mode=""></image>
					<view class="">
						进入商城主页
					</view>
				</view>
				<view class=""
					@click="jump('/plugins/mch_solitaire/solist/solist?mch_id='+solist.mch_id+'&lauser_id='+solist.user_id)">
					<image class="rea-solitem-img" src="/static/image/icon/icon-mch.png" mode=""></image>
					<view class="">
						查看全部接龙
					</view>
				</view>
				<view class="" @click="jump('/plugins/integral_mall/index/index')">
					<image class="rea-solitem-img" src="/static/image/icon/icon-mch.png" mode=""></image>
					<view class="">
						金币可购买商品
					</view>
				</view>
				<view class=""
					@click="jump('/plugins/mch_solitaire/solist/solist?mch_id='+solist.mch_id+'&lauser_id='+solist.user_id)">
					<image class="rea-solitem-img" src="/static/image/icon/icon-mch.png" mode=""></image>
					<view class="">
						我参与的接龙
					</view>
				</view> -->
				</view>
				<!-- <view class="rea-btn" @click="tosolitaire" v-if="!isonlykan">
				我要接龙
			</view> -->
				<view v-if="souserlist.length" class="solitaireor">
					<view class="so-item" v-for="(item, index) in souserlist" :key="index">
						<view class="so-index"> {{ totalcount - index }}. </view>
						<image class="so-avatar" :src="item.user.userInfo.avatar" mode=""></image>
						<view class="so-content">
							<view class="so-ava">{{ item.user.nickname.slice(0, 1) }} **</view>
							<!-- <view class="">+1</view> -->
							<view class="dir-right-wrap cross-center main-right" style="flex: 1;">
								<view style="text-align: right;word-wrap: break-word;word-break: break-all;" class=""
									v-for="(goodsitem, goodsindex) in item.goods_info" :key="index">
									{{ goodsitem.goods_attr.name }}
									<text>[{{ goodsitem.attr_list[0].attr_name }}]</text>
									<text style="display: inline-block;">+{{ goodsitem.goods_attr.number }}</text>
									<text v-if="goodsindex != item.goods_info.length - 1">，</text>
								</view>
							</view>
						</view>
					</view>
					<view class="moreuser">
						<view class="" v-if="page < pagecount" @click="tomoreuser">
							点击查看更多
						</view>
						<view v-if="moreloading" class="">
							加载中...
						</view>
					</view>
				</view>
				<view v-else class="soli-else">
					一大波人正在赶来...
				</view>
			</view>

			<!-- <view class="" style="height: 152rpx;"></view> -->
			<view class="step-popup">
				<u-popup :safeAreaInsetBottom="true" v-model="showgoods" mode="bottom" border-radius="14"
					@close="showgoods = false" v-if="showgoods">
					<view class="fmodel" @touchmove.stop.prevent>
						<view class="f-top dir-left-nowrap main-between cross-center">
							<view class="f-title">已选{{ cartnum }}件商品</view>
							<view class="f-image" @click="showgoods = false">
								<image class="f-img" src="/static/image/icon/icon-close.png"></image>
							</view>
						</view>
						<scroll-view scroll-y class="f-scroll">
							<view class="list-two">
								<view class="list-two-item" v-for="(item, index) in cartsgoods" :key="index">
									<view class="list-two-image">

										<image v-if="item.detail.cover_pic" class="image" :src="item.detail.cover_pic"
											mode="">
										</image>
										<view class="list-two-miaosha" :class="getTheme + '-m-back ' + getTheme"
											v-if="item.detail.sign == 'miaosha'">
											<text v-if="item.msdetail.miaosha_status == 2">
												{{
                        item.msdetail.detail.miaoshaGoods.open_date +
                          " " +
                          item.msdetail.detail.miaoshaGoods.open_time +
                          ":00开始秒杀"
                      }}
											</text>
											<text v-else>秒杀商品</text>
										</view>
									</view>

									<view class="dir-top-nowrap" style="flex: 1;padding: 0 24rpx;width: 216rpx;">
										<view class="list-two-title u-line-1">{{item.detail.name}}</view>
										<view class="list-two-subtitle u-line-1">{{item.detail.subtitle}}</view>
										<view class="">
											<text class="rea-price" v-if="!item.ispechoice">
												<text v-if="item.detail.min_price">
													￥{{ item.detail.min_price }}
													<text
														v-if="item.detail.max_price != item.detail.min_price">~￥{{ item.detail.max_price }}
													</text>
												</text>
												<text v-else-if="item.detail.price_min">
													￥{{ item.detail.price_min }}
													<text
														v-if="item.detail.price_max != item.detail.price_min">~￥{{ item.detail.price_max }}
													</text>
												</text>
												<text v-else>￥{{ item.detail.price }}</text>
											</text>
											<text class="rea-price" v-else>
												￥{{ item.price }} / {{ item.attname }}
											</text>
											<!-- <text class="rea-spec"> /220规格</text> -->
										</view>
									</view>
									<view class="spechoi" v-if="!item.detail.goods_stock">
										<view style="background-color: #eeeeee;border-radius: 6rpx;color: #5f5f5f;"
											class="rea-choice">
											已抢光
										</view>
									</view>
									<view class="spechoi" v-if="item.detail.goods_stock">
										<!-- <view v-if="item.despec && !item.ispechoice" class="spechoice">
										<view class="rea-plus" @click="addspecnum(item)"></view>
									</view> item.detail.attr.length > 0 && -->
										<view v-if="!item.ispechoice" class="rea-choice" @click="addattrshow(item)">
											加入购物车
										</view>
										<view class="">
											<!-- <goods-attr :is_show_left="false" :is_must_left="false" :themeObject="themeObject"
											:goods="item.detail" v-model="item.attrShow" :checked="checked" @check="check">
										</goods-attr> -->
											<!-- <sol-attr-goods :goods="item.detail" :attrGroupList="item.detail.attr_groups"
											:theme="getTheme" :show="item.attrShow"></sol-attr-goods> -->
										</view>
										<view class="spechoice" v-if="item.ispechoice">
											<view class="rea-reduce" @click="reducecartsnum(item)"></view>
											<view class="specn">{{ item.specnum }}</view>
											<view class="rea-plus" :class="item.stock <= item.specnum ? 'failed' : ''"
												@click="addnum(item)"></view>
										</view>
									</view>
								</view>
							</view>
						</scroll-view>
						<view class="safe-area-inset-bottom"></view>
					</view>
				</u-popup>
			</view>
			<view class="share-popup">
				<u-popup :safeAreaInsetBottom="true" v-model="showshare" mode="bottom" border-radius="14"
					@close="showshare = false" v-if="showshare">
					<view class="dir-left-nowrap cross-center main-around" style="padding: 120rpx 0;">
						<!-- :id="goodslist[0].detail.goods_warehouse_id" -->
						<button id="share1" class="share-btn" plain open-type="share">
							<image style="width: 60rpx;height: 60rpx;border-radius: 50%;background: rgba(0, 0, 0, .5);"
								src="/static/image/share.png" mode=""></image>
							<view class="">
								分享商品
							</view>
						</button>
						<button id="share2" class="share-btn" plain open-type="share">
							<image style="width: 60rpx;height: 60rpx;border-radius: 50%;background: rgba(0, 0, 0, .5);"
								src="/static/image/share.png" mode=""></image>
							<view class="">
								分享购买记录
							</view>
						</button>
					</view>
					<view class="box-grow-1 main-center cross-center sharecancel"
						:class="getTheme + '-s-back ' + getTheme + '-m-text ' + getTheme" @click="showshare = false">
						取消
					</view>
				</u-popup>
			</view>
			<view class="poster-popup">
				<u-popup :safeAreaInsetBottom="true" v-model="isshowqr" mode="center" border-radius="0"
					@close="isshowqr = false" v-if="isshowqr">
					<view class="postercancel" @click="isshowqr = false">
						<icon type="cancel" color="#FFF"></icon>
					</view>
					<view class="">
						<image mode="widthFix" style="width: 520rpx;" :src="qrimg"></image>
					</view>
					<view class="box-grow-1 main-center cross-center posterbtn"
						:class="getTheme + '-m-back ' + getTheme" @click="saveposter">
						保存图片
					</view>
				</u-popup>
			</view>
		</view>
	</app-layout>
</template>

<script>
	import {
		mapState,
		mapGetters
	} from "vuex";
	import uploadFile from "../../../core/upload.js"
	import goodsAttr from "../components/goods-attr.vue";
	import solAttrGoods from "../components/sol-attr-goods.vue";
	import appRichText from "../../../components/basic-component/app-rich/parse";
	import uOrdinaryList from "../../../components/page-component/u-goods-list/u-ordinary-list.vue";
	import uPopup from "../../../components/basic-component/u-popup/u-popup.vue";
	import appSwiper from "../../../components/page-component/app-swiper/app-swiper.vue"
	import {
		async
	} from "regenerator-runtime";
	export default {
		components: {
			goodsAttr,
			appRichText,
			solAttrGoods,
			uOrdinaryList,
			uPopup,
			appSwiper
		},
		watch: {
			qjl_id: {
				handler(newval) {
					if (newval !== 0) {
						let self = this
						let qdata = {
							type: 1,
							id: newval,
						};
							// console.log(newval,"aaaaaaaaaaaaanewval");
							// uni.showLoading({
							// 	title:'加载中',
							// 	mask:true
							// })
						let timer = setTimeout(()=>{							 
							// console.log("我是定时器");
							self.getQjl(qdata)
							// uni.hideLoading()
						},2500)
		
					}
				},
				deep: true
			}
		},
		onReady() {
			wx.getSystemInfo({
				success: (res) => {
					//导航高度
					this.navHeight = res.statusBarHeight + 46;
				},
				fail(err) {
					console.log(err);
				},
			});
		},
		
		onShow() {
			let self = this;
			// console.log(self.$store.state.user.agent_distrid, 'self.$store.state.agent_distrid');
			// console.log(self.agentDistrid, 'self.agentDistrid');
			self.cartnum = 0;
			self.cartprice = 0;
			self.cartgoods = [];
			self.cartsgoods = [];
			self.souserlist = [];
			self.page = 1;
			self.pagecount = 1;
			self.initQunuser();
			let qdata = {
				type: 1,
				id: self.qjl_id,
			};
			if (self.$store.state.user.agent_distrid) {
				qdata.qjlagent_id = self.$store.state.user.agent_distrid;
			}
			if (self.agent_distrid) {
				qdata.qjlagent_id = self.agent_distrid;
			}
			self.getQjl(qdata)
			
		},
		onShareAppMessage(e) {
			// console.log(e,"aaaaaaaaaaaaaa");
			this.postShareID()
			// @qjl_id: 群接龙id
			let spath =
				"plugins/mch_solitaire/solitaire/solitaire?qjl_id=" + this.qjl_id;
			if (this.distrid) {
				spath =
					"plugins/mch_solitaire/solitaire/solitaire?qjl_id=" +
					this.qjl_id +
					"&agent_distrid=" +
					this.distrid +
					"&share_id=" +
					this.userid;
			}

			// 把图片的网络i地址从富文本中截取出来
			let lista = this.getImgSrc(this.solist.detail)
			if (e.from === "menu") {
				if (lista.length >= 3) {
					let qjlshare = {
						bg_url: "https://wechatshop.shuangxitang.cn/web/images/qrcodebg5_4.png",
					};

					let usershare = [{
						name: "",
						url: this.solist.user.userInfo.avatar,
						stream: 0,
						left: 22,
						top: 0,
						right: 0,
						bottom: 0,
						width: 60,
						height: 60,
						radius: 0,
						opacity: 100,
					}, ];
					qjlshare.image = usershare; // 头像

					var priceArr = []
					this.goodslist.map(item => {
						if (item.detail.min_price) {
							if (item.detail.min_price != item.detail.max_price) {
								priceArr.push(item.detail.max_price)
								priceArr.push(item.detail.min_price)
							} else {
								priceArr.push(item.detail.min_price)
							}
						} else if (item.detail.price_min) {
							if (item.detail.price_max != item.detail.price_min) {
								priceArr.push(item.detail.price_max)
								priceArr.push(item.detail.price_min)
							} else {
								priceArr.push(item.detail.price_min)
							}
						} else {
							priceArr.push(item.detail.price)
						}
					})
					var maxPrice = Math.max.apply(null, priceArr);
					var minPrice = Math.min.apply(null, priceArr);
					console.log(priceArr,"aaaaaaaaaaaaaaa");
					var price
					if (maxPrice == minPrice) {
						price = minPrice
					} else {
						price = minPrice + "-" + maxPrice
					}
					qjlshare.text = [
						// 微信名称
						{
							text: this.solist.user.nickname.length > 7 ?
								this.solist.user.nickname.slice(0, 7) + "…" : this.solist.user.nickname,
							left: 92, // 500 400
							top: 35,
							fontSize: 18,
							fontColor: "0,0,0",
							angle: 0,
						},
						// 购买人数
						{
							text: "已有" + this.solist.qjlordernum + "人购买",
							left: 302, // 500 400
							top: 33,
							fontSize: 16,
							fontColor: "153,153,153",
							angle: 0,
						},
						{
							text: "￥" + price,
							left: 12,
							top: 120,
							fontSize: 35,
							fontColor: "255, 85, 0",
							angle: 0,
						},


					];


					let sharegs = [];
					let arr = []
					lista.map((item, index) => {
						if (index < 3) {
							arr.push(item)
						}
					})
					sharegs = arr
						.map((item, index) => {
							return {
								name: "",
								url: item,
								stream: 0,
								left: index > 2 ? (index - 3) * 155 : 22 + index * 146,
								top: 140,
								right: 0,
								bottom: 0,
								width: 144,
								height: 160,
								radius: 0,
								opacity: 100,
							};

						})

					qjlshare.image = qjlshare.image.concat(sharegs);


					return this.$request({
							url: this.$apiSol.generate.aposter,
							method: "post",
							header: {
								"content-type": "application/json",
							},
							data: qjlshare,
						})
						.then((res) => {
							return {
								title: this.solist.title,
								path: spath,
								imageUrl: res.imgurl,
							};
						})
						.catch(() => {});
				} else {
					let qjlshare = {
						bg_url: "https://wechatshop.shuangxitang.cn/web/images/newbg5_4.png",
					};

					let usershare = [{
						name: "",
						url: this.solist.user.userInfo.avatar,
						stream: 0,
						left: 25,
						top: 25,
						right: 0,
						bottom: 0,
						width: 50,
						height: 50,
						radius: 0,
						opacity: 100,
					}, ];
					qjlshare.image = usershare;
					qjlshare.text = [{
							text: this.solist.user.nickname.length > 7 ?
								this.solist.user.nickname.slice(0, 7) + "…" : this.solist.user.nickname,
							left: 85, // 500 400
							top: 33 + 25,
							fontSize: 16,
							fontColor: "0,0,0",
							angle: 0,
						},
						{
							text: "已有" + this.solist.qjlordernum + "人购买",
							left: 302, // 500 400
							top: 33 + 25,
							fontSize: 16,
							fontColor: "0,0,0",
							angle: 0,
						},
					];

					let cgoodsimg = {
						name: "",
						url: this.goodslist[0].detail.cover_pic,
						stream: 0,
						left: 25,
						top: 108,
						right: 0,
						bottom: 0,
						width: 250,
						height: 250,
						radius: 0,
						opacity: 100,
					};


					qjlshare.image = qjlshare.image.concat(cgoodsimg);
					// console.log(this.cugoods.detail, 'cudetsiallllllllllllllllll');
					var priceArr = []
					this.goodslist.map(item => {
						if (item.detail.min_price) {
							if (item.detail.min_price != item.detail.max_price) {
								priceArr.push(item.detail.max_price)
								priceArr.push(item.detail.min_price)
							} else {
								priceArr.push(item.detail.min_price)
							}
						} else if (item.detail.price_min) {
							if (item.detail.price_max != item.detail.price_min) {
								priceArr.push(item.detail.price_max)
								priceArr.push(item.detail.price_min)
							} else {
								priceArr.push(item.detail.price_min)
							}
						} else {
							priceArr.push(item.detail.price)
						}
					})
					var maxPrice = Math.max.apply(null, priceArr);
					var minPrice = Math.min.apply(null, priceArr);
					// console.log(priceArr,"aaaaaaaaaaaaaaa");
					var price
					if (maxPrice == minPrice) {
						price = minPrice
					} else {
						price = minPrice + "-" + maxPrice
					}


					let cgoodstxt = {
						text: "￥" + minPrice,
						left: 310,
						top: 210,
						fontSize: 32,
						fontColor: "9,186,7",
						angle: 0,
					};
					qjlshare.text = qjlshare.text.concat(cgoodstxt);

					return this.$request({
							url: this.$apiSol.generate.aposter,
							method: "post",
							header: {
								"content-type": "application/json",
							},
							data: qjlshare,
						})
						.then((res) => {
							return {
								title: this.solist.title,
								path: spath,
								imageUrl: res.imgurl,
							};
						})
						.catch(() => {});
				}
			} else if (e.target.id == "share1") {
				// console.log("我是从menu分享出去的");
				if (lista.length >= 3) {
					let qjlshare = {
						bg_url: "https://wechatshop.shuangxitang.cn/web/images/qrcodebg5_4.png",
					};

					let usershare = [{
						name: "",
						url: this.solist.user.userInfo.avatar,
						stream: 0,
						left: 22,
						top: 0,
						right: 0,
						bottom: 0,
						width: 60,
						height: 60,
						radius: 0,
						opacity: 100,
					}, ];
					qjlshare.image = usershare; // 头像

					var priceArr = []
					this.goodslist.map(item => {
						if (item.detail.min_price) {
							if (item.detail.min_price != item.detail.max_price) {
								priceArr.push(item.detail.max_price)
								priceArr.push(item.detail.min_price)
							} else {
								priceArr.push(item.detail.min_price)
							}
						} else if (item.detail.price_min) {
							if (item.detail.price_max != item.detail.price_min) {
								priceArr.push(item.detail.price_max)
								priceArr.push(item.detail.price_min)
							} else {
								priceArr.push(item.detail.price_min)
							}
						} else {
							priceArr.push(item.detail.price)
						}
					})
					var maxPrice = Math.max.apply(null, priceArr);
					var minPrice = Math.min.apply(null, priceArr);
					// console.log(priceArr,"aaaaaaaaaaaaaaa");
					var price
					if (maxPrice == minPrice) {
						price = minPrice
					} else {
						price = minPrice + "-" + maxPrice
					}
					qjlshare.text = [
						// 微信名称
						{
							text: this.solist.user.nickname.length > 7 ?
								this.solist.user.nickname.slice(0, 7) + "…" : this.solist.user.nickname,
							left: 92, // 500 400
							top: 35,
							fontSize: 18,
							fontColor: "0,0,0",
							angle: 0,
						},
						// 购买人数
						{
							text: "已有" + this.solist.qjlordernum + "人购买",
							left: 302, // 500 400
							top: 33,
							fontSize: 16,
							fontColor: "153,153,153",
							angle: 0,
						},
						{
							text: "￥" + price,
							left: 12,
							top: 120,
							fontSize: 35,
							fontColor: "255, 85, 0",
							angle: 0,
						},


					];


					let sharegs = [];
					let arr = []
					lista.map((item, index) => {
						if (index < 3) {
							arr.push(item)
						}
					})
					sharegs = arr
						.map((item, index) => {
							return {
								name: "",
								url: item,
								stream: 0,
								left: index > 2 ? (index - 3) * 155 : 22 + index * 146,
								top: 140,
								right: 0,
								bottom: 0,
								width: 144,
								height: 160,
								radius: 0,
								opacity: 100,
							};

						})

					qjlshare.image = qjlshare.image.concat(sharegs);


					return this.$request({
							url: this.$apiSol.generate.aposter,
							method: "post",
							header: {
								"content-type": "application/json",
							},
							data: qjlshare,
						})
						.then((res) => {
							return {
								title: this.solist.title,
								path: spath,
								imageUrl: res.imgurl,
							};
						})
						.catch(() => {});
				} else {
					let qjlshare = {
						bg_url: "https://wechatshop.shuangxitang.cn/web/images/newbg5_4.png",
					};

					let usershare = [{
						name: "",
						url: this.solist.user.userInfo.avatar,
						stream: 0,
						left: 25,
						top: 25,
						right: 0,
						bottom: 0,
						width: 50,
						height: 50,
						radius: 0,
						opacity: 100,
					}, ];
					qjlshare.image = usershare;
					qjlshare.text = [{
							text: this.solist.user.nickname.length > 7 ?
								this.solist.user.nickname.slice(0, 7) + "…" : this.solist.user.nickname,
							left: 85, // 500 400
							top: 33 + 25,
							fontSize: 16,
							fontColor: "0,0,0",
							angle: 0,
						},
						{
							text: "已有" + this.solist.qjlordernum + "人购买",
							left: 302, // 500 400
							top: 33 + 25,
							fontSize: 16,
							fontColor: "0,0,0",
							angle: 0,
						},
					];

					let cgoodsimg = {
						name: "",
						url: this.goodslist[0].detail.cover_pic,
						stream: 0,
						left: 25,
						top: 108,
						right: 0,
						bottom: 0,
						width: 250,
						height: 250,
						radius: 0,
						opacity: 100,
					};


					qjlshare.image = qjlshare.image.concat(cgoodsimg);
					// console.log(this.cugoods.detail, 'cudetsiallllllllllllllllll');
					var priceArr = []
					this.goodslist.map(item => {
						if (item.detail.min_price) {
							if (item.detail.min_price != item.detail.max_price) {
								priceArr.push(item.detail.max_price)
								priceArr.push(item.detail.min_price)
							} else {
								priceArr.push(item.detail.min_price)
							}
						} else if (item.detail.price_min) {
							if (item.detail.price_max != item.detail.price_min) {
								priceArr.push(item.detail.price_max)
								priceArr.push(item.detail.price_min)
							} else {
								priceArr.push(item.detail.price_min)
							}
						} else {
							priceArr.push(item.detail.price)
						}
					})
					var maxPrice = Math.max.apply(null, priceArr);
					var minPrice = Math.min.apply(null, priceArr);
					// console.log(priceArr,"aaaaaaaaaaaaaaa");
					var price
					if (maxPrice == minPrice) {
						price = minPrice
					} else {
						price = minPrice + "-" + maxPrice
					}



					let cgoodstxt = {
						text: "￥" + minPrice,
						left: 310,
						top: 210,
						fontSize: 32,
						fontColor: "9,186,7",
						angle: 0,
					};
					qjlshare.text = qjlshare.text.concat(cgoodstxt);

					return this.$request({
							url: this.$apiSol.generate.aposter,
							method: "post",
							header: {
								"content-type": "application/json",
							},
							data: qjlshare,
						})
						.then((res) => {
							return {
								title: this.solist.title,
								path: spath,
								imageUrl: res.imgurl,

								success: (res) => {
									console.log("csssssssSSSSSSSSSSS", res);
								}
							};

						})
						.catch(() => {});

				}

			} else if (e.target.id == "share2") {
				let qjlshare = {
					bg_url: "https://wechatshop.shuangxitang.cn/web/images/qrcodebg5_4.png",
				};

				let usershare = [{
					name: "",
					url: this.solist.user.userInfo.avatar,
					stream: 0,
					left: 0,
					top: 0,
					right: 0,
					bottom: 0,
					width: 60,
					height: 60,
					radius: 0,
					opacity: 100,
				}, ];
				qjlshare.image = usershare; // 头像				
				var priceArr = []
				this.goodslist.map(item => {
					if (item.detail.min_price) {
						if (item.detail.min_price != item.detail.max_price) {
							priceArr.push(item.detail.max_price)
							priceArr.push(item.detail.min_price)
						} else {
							priceArr.push(item.detail.min_price)
						}
					} else if (item.detail.price_min) {
						if (item.detail.price_max != item.detail.price_min) {
							priceArr.push(item.detail.price_max)
							priceArr.push(item.detail.price_min)
						} else {
							priceArr.push(item.detail.price_min)
						}
					} else {
						priceArr.push(item.detail.price)
					}
				})
				var maxPrice = Math.max.apply(null, priceArr);
				var minPrice = Math.min.apply(null, priceArr);
				var price
				if (maxPrice == minPrice) {
					price = minPrice
				} else {
					price = minPrice + "-" + maxPrice
				}

				// console.log(priceArr);
				qjlshare.text = [
					// 微信名称
					{
						text: this.solist.user.nickname.length > 7 ?
							this.solist.user.nickname.slice(0, 7) + "…" : this.solist.user.nickname,
						left: 70, // 500 400
						top: 35,
						fontSize: 18,
						fontColor: "0,0,0",
						angle: 0,
					},
					// 购买人数
					{
						text: "已有" + this.solist.qjlordernum + "人购买",
						left: 302, // 500 400
						top: 33,
						fontSize: 16,
						fontColor: "153,153,153",
						angle: 0,
					},
					// {
					// 	text:str1,
					// 	left:0,
					// 	top:80,
					// 	fontSize:16,
					// 	fontColor:"0,0,0,0",
					// 	angle:0
					// },
					// {
					// 	text:str2 + "...",
					// 	left:0,
					// 	top:110,
					// 	fontSize:16,
					// 	fontColor:"0,0,0,0",
					// 	angle:0
					// },
					{
						text: "￥" + price,
						left: 0,
						top: 120,
						fontSize: 35,
						fontColor: "255, 85, 0",
						angle: 0,
					},
				];
				// this.avaterimg.map((h, index)=>{
				// 如果列表为空
				if (this.souserlist.length == 0) {
					let cgoodstxt1 = {
						text: "暂无购买记录",
						left: 150,
						top: 200,
						fontSize: 20,
						fontColor: "0,0,0,0",
						angle: 0
					};
					qjlshare.text.push(cgoodstxt1);
				} else {
					let arr = []
					let imgarr = []
					this.souserlist.map((item, index) => {
						if (index < 6) {
							arr.push(item)
							imgarr.push(item)
						}
					})


					let cgoodsimg = imgarr
						.map((item, index) => {
							return {
								name: "",
								url: item.user.userInfo.avatar,
								stream: 0,
								left: 0,
								top: (index + 1) * 27 + 120,
								right: 0,
								bottom: 0,
								width: 24,
								height: 24,
								radius: 0,
								opacity: 100,
							};

						})

					qjlshare.image = qjlshare.image.concat(cgoodsimg);



					arr.map((h, index) => {

						let cgoodstxt = {
							text: h.user.nickname.slice(0, 1) + "**",
							left: 50,
							top: (index + 1) * 27 + 140,
							fontSize: 14,
							fontColor: "0,0,0,0",
							angle: 0
						};
						let cgoodNum = {
							text: "+1",
							left: 390,
							top: (index + 1) * 27 + 140,
							fontSize: 14,
							fontColor: "255, 170, 0, 0.0",
							angle: 0
						};
						let buylist = {
							text: h.goods_info[0].goods_attr.name.slice(0, 8) + "...",
							left: 130,
							top: (index + 1) * 27 + 140,
							fontSize: 14,
							fontColor: "0,0,0,0",
							angle: 0
						};
						qjlshare.text.push(cgoodstxt);
						qjlshare.text.push(buylist);
						qjlshare.text.push(cgoodNum);


					});

				}
				// console.log('qjlshare.text.concat(cgoodstxt)', qjlshare.text.concat(cgoodstxt))
				// qjlshare.text = qjlshare.text.concat(cgoodstxt);
				return this.$request({
						url: this.$apiSol.generate.aposter,
						method: "post",
						header: {
							"content-type": "application/json",
						},
						data: qjlshare,
					})
					.then((res) => {
						return {
							title: this.solist.title,
							path: spath,
							imageUrl: res.imgurl,
						};
					})
					.catch(() => {});

				// }
				// let qjlshare = {
				// 	bg_url: "https://wechatshop.shuangxitang.cn/web/images/qrcodebg5_4.png",
				// };

				// //
				// let usershare = [{
				// 	name: "",
				// 	url: this.solist.user.userInfo.avatar,
				// 	stream: 0,
				// 	left: 25,
				// 	top: 0,
				// 	right: 0,
				// 	bottom: 0,
				// 	width: 50,
				// 	height: 50,
				// 	radius: 0,
				// 	opacity: 100,
				// }, ];
				// qjlshare.image = usershare;
				// qjlshare.text = [{
				// 		text: this.solist.user.nickname.length > 7 ?
				// 			this.solist.user.nickname.slice(0, 7) + "…" : this.solist.user.nickname,
				// 		left: 85, // 500 400
				// 		top: 33,
				// 		fontSize: 16,
				// 		fontColor: "0,0,0",
				// 		angle: 0,
				// 	},
				// 	{
				// 		text: "已有" + this.solist.qjlordernum + "人购买",
				// 		left: 302, // 500 400
				// 		top: 33,
				// 		fontSize: 16,
				// 		fontColor: "153,153,153",
				// 		angle: 0,
				// 	},
				// ];
				// if (this.souserlist.length > 0) {
				// 	let sharegs = [];
				// 	sharegs = this.souserlist.map((item, index) => {
				// 		if (index < 6) {
				// 			return {
				// 				name: "",
				// 				url: item.user.userInfo.avatar,
				// 				stream: 0,
				// 				left: 57,
				// 				top: 50 + (index + 1) * 25 + index * 50,
				// 				right: 0,
				// 				bottom: 0,
				// 				width: 50,
				// 				height: 50,
				// 				radius: 25,
				// 				opacity: 100,
				// 			};
				// 		}
				// 	});
				// 	qjlshare.image = qjlshare.image.concat(sharegs);
				// 	let sharetext = [];
				// 	let sharenum = [];
				// 	sharetext = this.souserlist.map((item, index) => {
				// 		return {
				// 			text: item.user.nickname.length > 12 ?
				// 				item.user.nickname.slice(0, 12) + "…" : item.user.nickname,
				// 			left: 123, // 500 400
				// 			top: 33 + 50 + (index + 1) * 25 + index * 50,
				// 			fontSize: 16,
				// 			fontColor: "0,0,0",
				// 			angle: 0,
				// 		};
				// 	});
				// 	sharenum = this.souserlist.map((item, index) => {
				// 		return {
				// 			text: this.totalcount - index,
				// 			left: 25, // 500 400
				// 			top: 33 + 50 + (index + 1) * 25 + index * 50,
				// 			fontSize: 16,
				// 			fontColor: "153,153,153",
				// 			angle: 0,
				// 		};
				// 	});
				// 	qjlshare.text = qjlshare.text.concat(sharetext, sharenum);
				// 	// qjlshare.text = qjlshare.text.concat()
				// }


				// let a = this.$request({
				// 		url: this.$apiSol.generate.aposter,
				// 		method: "post",
				// 		header: {
				// 			"content-type": "application/json",
				// 		},
				// 		data: qjlshare,
				// 	})
				// 	.then((res) => {
				// 		return {
				// 			title: this.solist.title,
				// 			path: spath,
				// 			imageUrl: res.imgurl,
				// 		};
				// 	})
				// 	.catch(() => {});

				// console.log('6666666666', a)
			} else {
				let qjlshare = {
					bg_url: "https://wechatshop.shuangxitang.cn/web/images/newbg5_4.png",
				};

				// 商品信息背景
				let usershare = [{
					name: "",
					url: this.solist.user.userInfo.avatar,
					stream: 0,
					left: 25,
					top: 25,
					right: 0,
					bottom: 0,
					width: 50,
					height: 50,
					radius: 0,
					opacity: 100,
				}, ];
				qjlshare.image = usershare;
				qjlshare.text = [{
						text: this.solist.user.nickname.length > 7 ?
							this.solist.user.nickname.slice(0, 7) + "…" : this.solist.user.nickname,
						left: 85, // 500 400
						top: 33 + 25,
						fontSize: 16,
						fontColor: "255,255,255",
						angle: 0,
					},
					{
						text: "已有" + this.solist.qjlordernum + "人购买",
						left: 302, // 500 400
						top: 33 + 25,
						fontSize: 16,
						fontColor: "255,255,255",
						angle: 0,
					},
				];

				let cgoodsimg = this.goodslist
					.map((item) => {
						// console.log(item, 'indeinkdsjdosdjaposdas');
						if (item.detail.goods_warehouse_id == e.target.id) {
							return {
								name: "",
								url: item.detail.cover_pic,
								stream: 0,
								left: 25,
								top: 108,
								right: 0,
								bottom: 0,
								width: 250,
								height: 250,
								radius: 0,
								opacity: 100,
							};
						}
					})
					.filter((item) => {
						return item;
					});
				qjlshare.image = qjlshare.image.concat(cgoodsimg);
				// console.log(this.cugoods.detail, 'cudetsiallllllllllllllllll');
				var priceArr = []
				this.goodslist.map(item => {
					if (item.detail.min_price) {
						if (item.detail.min_price != item.detail.max_price) {
							priceArr.push(item.detail.max_price)
							priceArr.push(item.detail.min_price)
						} else {
							priceArr.push(item.detail.min_price)
						}
					} else if (item.detail.price_min) {
						if (item.detail.price_max != item.detail.price_min) {
							priceArr.push(item.detail.price_max)
							priceArr.push(item.detail.price_min)
						} else {
							priceArr.push(item.detail.price_min)
						}
					} else {
						priceArr.push(item.detail.price)
					}
				})
				var maxPrice = Math.max.apply(null, priceArr);
				var minPrice = Math.min.apply(null, priceArr);
				// console.log(priceArr,"aaaaaaaaaaaaaaa");
				var price
				if (maxPrice == minPrice) {
					price = minPrice
				} else {
					price = minPrice + "-" + maxPrice
				}


				let cgoodstxt = {
					text: "￥" + minPrice,
					left: 310,
					top: 210,
					fontSize: 32,
					fontColor: "9,186,7",
					angle: 0,
				};
				qjlshare.text = qjlshare.text.concat(cgoodstxt);
				// qjlshare.shareId= this.userid
				/* if (this.souserlist.length > 0) {
					let sharegs = []
					sharegs = this.souserlist.map((item, index) => {
						if (index < 6) {
							return {
								name: "",
								url: item.user.userInfo.avatar,
								"stream": 0,
								"left": 57,
								"top": 50 + (index + 1) * 25 + index * 50,
								"right": 0,
								"bottom": 0,
								"width": 50,
								"height": 50,
								"radius": 25,
								"opacity": 100
							}
						}
					})
					qjlshare.image = qjlshare.image.concat(sharegs)
					let sharetext = []
					let sharenum = []
					sharetext = this.souserlist.map((item, index) => {
						return {
							text: item.user.nickname.length > 12 ? item.user.nickname.slice(0, 12) + '…' : item
								.user.nickname,
							"left": 123, // 500 400
							"top": 33 + 50 + (index + 1) * 25 + index * 50,
							"fontSize": 16,
							"fontColor": "0,0,0",
							"angle": 0
						}
					})
					sharenum = this.souserlist.map((item, index) => {
						return {
							text: this.totalcount - index,
							"left": 25, // 500 400
							"top": 33 + 50 + (index + 1) * 25 + index * 50,
							"fontSize": 16,
							"fontColor": "153,153,153",
							"angle": 0
						}
					})
					qjlshare.text = qjlshare.text.concat(sharetext, sharenum)
					// qjlshare.text = qjlshare.text.concat()
				} */
				return this.$request({
						url: this.$apiSol.generate.aposter,
						method: "post",
						header: {
							"content-type": "application/json",
						},
						data: qjlshare,
					})
					.then((res) => {
						return {
							title: this.solist.title,
							path: spath,
							imageUrl: res.imgurl,
						};

					})
					.catch(() => {});
			}
		},
		onPageScroll(e) {
			uni
				.createSelectorQuery()
				.select(".list-two")
				.boundingClientRect((data) => {
					//目标位置的节点：类或者id
					if (data.top > 120 || data.top < 0) {
						this.isTop = false;
					} else {
						this.isTop = true;
					}
					// uni.pageScrollTo({
					// 	duration: 100, //过渡时间
					// 	scrollTop: data.top, //到达距离顶部的top值
					// })
				})
				.exec();
		},
		onLoad(options) {
			let self = this;
			// console.log(options,"aaaa");			
			self.shareId = options.share_id
			self.onReq(30);
			self.onAllReq(31);
			self.storeupdown();
			self.getUserInfo();
			self.gotoPic();


			if (options.scene) {
				let deoptions = decodeURIComponent(options.scene);
				// console.log("assssssssss",deoptions);
				let str = deoptions
				let opID = str.split(',')[0]
				let agID = str.split(',')[1]
				// console.log(opID,agID,'xxxxxxxxxxxxxxx');				
				self.qjl_id = opID;
				self.agent_distrid = agID;
			}
			if (options.qjl_id) {
				self.qjl_id = options.qjl_id;
			}
			if (options.distrid) {
				self.distrid = options.distrid || 0;
			}
			// console.log(self.qjl_id);
			if (options.agent_distrid) {
				self.agent_distrid = options.agent_distrid;
				self.$store.dispatch("user/agent_distrid", self.agent_distrid);
			}
			if (options.isonlykan) {
				self.isonlykan = options.isonlykan == "true" ? true : false;
			} else {
				self.isonlykan = false;
			}
			// console.log(self.isonlykan);
			if (self.isonlykan) {
				// console.log('999');
			} else if (!self.isonlykan) {
				// console.log('000');
			}
			let qdata = {
				type: 1,
				id: self.qjl_id,
			};
			self.getQjl(qdata)

		},
		data() {
			return {
				qrimg: "",
				isshowqr: false,
				changeBg: false,
				navHeight: 80,
				solist: [], // 群接龙信息（包含商品信息）
				goodslist: [], // 商品列表
				souserlist: [], // 当前购买群接龙人员信息
				page: 1,
				pagecount: 1,
				pageSize: 10,
				totalcount: 1,

				mch_id: 0,
				goods_mch_id: 0,
				qjl_id: 0,
				distrid: 0,
				agent_distrid: 0,
				agent_info: "",

				checked: null,

				despec: true, // 是否默认规格 单规格:true 多规格:false 每个商品单独拥有 （需废弃）
				ispechoice: false, // 是否选择规格 选择:true 未选择:false 每个商品单独拥有 （需废弃）
				specnum: 1, // 规格数量 每个商品单独拥有 （需废弃）

				cugoods: {
					// 唤起选择规格 单个商品选择规格
					detail: {},
					attrShow: 0,
				},

				cartgoods: [], // 打算购买的商品
				allprice: "", // 选择商品的总价
				buy_mch_id: 0,
				isonlykan: false,
				moreloading: false,

				imglist: "",
				advimg: "",
				cartnum: 1,
				cartprice: 0,
				cartsgoods: [],
				showgoods: false,
				showdetail: false,
				avaterimg: [],

				fourbtn: [],
					
				getTheme: "q",
				longitude: "36.8103",
				latitude: "118.014",

				showshare: false,
				isTop: false,
				swiperList: [], //轮播图的数组
				goodsDetail: {},

				btnArr:[], //分享按钮数组
				userid: 0, //当前浏览群接龙人员信息
				shareId: 0, //当前分享接龙人员
			};
		},
		computed: {
			...mapState({
				userInfo: (state) => state.user.info,
				agentDistrid: (state) => state.user.agent_distrid,
			}),
			// ...mapGetters('mallConfig', {
			// 	getTheme: 'getTheme',
			// }),
			...mapGetters("iPhoneX", {
				botNavHei: "getNavHei",
				BotHeight: "getBotHeight",
			}),
			// agentid(){
			// 	console.log(this.agentDistrid,'agentDistrid');
			// },
			themeObject: function() {
				return {
					back: this.getTheme + "-m-back " + this.getTheme,
					theme: this.getTheme,
					color: this.getTheme + "-m-text " + this.getTheme,
					sBack: this.getTheme + "-s-back " + this.getTheme,
				};
			},
			newDetail() {
				let detail = "正在加载数据";
				if (this.solist) {
					detail = this.solist.detail;
				}
				return detail;
			},
		},
		methods: {
			// 点击分享
			checkShare(id){
				if(id == "164"){
					this.showshare = true
				}else{
					this.genposter()
				}
			},
			// 查看图片
			lookImage(url){
				// console.log("aaaaa" ,url);
				let imgs =[]
				imgs.push(url)
				// console.log(imgs);
				uni.previewImage({
					urls:imgs,
					current:0
				})
			},
			// 封装 请求方法
			getQjl(qdata) {
				var self = this
				self.$request({
						url: self.$apiSol.solitaire.addelxq,
						data: qdata,
					})
					.then((res) => {
						// 判定是否有背景图片
						if (res.data.list.background_img == null) {
							self.onReq(29);

						} else {
							self.imglist = res.data.list.background_img;
						}
						console.log(self.imglist);
						// console.log(res);
						self.solist = res.data.list;
						// console.log(self.solist, "kkkkkkkkkkk");
						self.checkUser()
						self.agent_info = res.data.agentuser;
						if (self.solist.length == 0) {
							uni.showToast({
								title: "该接龙已被删除",
								icon: "none",
							});
						}
						self.mch_id = self.solist.mch_id;
						self.buy_mch_id = self.solist.listtargetRelation[0].mch_id;
						self.qjl_id = self.solist.id;

						self.goodslist = self.solist.qjlTargetList.map((item, index) => {
							if (item.detail.attr.length > 0) {
								item.attrShow = false;
								item.despec = false; // 是否默认规格 单规格:true 多规格:false
								item.ispechoice = false; // 是否选择规格 选择:true 未选择:false
							}
							if (item.detail.sign == "miaosha") {
								if (item.msdetail.miaosha_status == 1) {
									self.getTime(item, item.msdetail.miaosha_time);
								}
							}
							return item;
							// return item = item.detail
						});
					});
					console.log("执行完毕");
			},

			// 传递id
			async postShareID() {
				const res = await this.$request({
					url: this.$apiSol.generate.postShareID,
					method: 'post',
					data: {
						shareId: this.userid
					}
				})
				// console.log("ressssssssssssssssss", res);
			},
			// 跳转主界面
			gotoIndex() {
				uni.switchTab({
					url: "/pages/my/my"
				})
			},
			// 截取
			getImgSrc(richtext) {
				// console.log('接受到的html',richtext )
				const imgList = []
				richtext.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/g, (match, capture) => {
					imgList.push(capture)
				})
				return imgList
			},
			// 点击上传图片背景
			changeBgPic() {
				// console.log("aaaaaaaaaaaaaaaaaaaaa");
				let self = this;
				let imagePath = '';
				let fileName = '';
				uni.chooseImage({
					count: 1,
					mediaType: 'image',
					sourceType: ['album'],
					fail(res) {
						uni.showToast({
							title: "获取相册失败"
						})
					},
					success(res) {
						// 设置更改背景的入参
						imagePath = res.tempFiles[0].path
						fileName = imagePath.substr(imagePath.lastIndexOf('/') + 1)
						uploadFile({
							url: self.$apiSol.upload.file,
							filePath: imagePath,
							fileType: 'image',
							fileName: fileName,
							mch_id: self.mch_id
						}).then(res => {
							// console.log("上传接口", res);
							if (res.statusCode !== 200) return uni.showToast({
								title: "上传失败"
							})
							const a = JSON.parse(res.data)
							// console.log(a,"aaaaaaaaaaaaaa");
							const data = {
								user_id: self.userid,
								mch_id: self.mch_id,
								img: a.data.url,
								id: self.qjl_id
							}
							self.uploadBg(data)
						})
					}
				})
			},
			// 上传背景
			async uploadBg(data) {
				const res = await this.$request({
					url: this.$apiSol.solitaire.background,
					method: 'get',
					data: data
				})
				if (res.msg == '请求失败') return uni.showToast({
					title: "上传失败"
				});
				// console.log("上传成功回调", res);
				this.getBgImg()
			},
			// 重新请求一下详情改变背景色
			async getBgImg() {
				const res = await this.$request({
					url: this.$apiSol.solitaire.addelxq,
					data: {
						type: 1,
						id: this.qjl_id,
					}
				})
				// console.log(",,,,,,,,,,,",res);
				this.imglist = res.data.list.background_img;
			},
			// 获取用户信息
			async getUserInfo() {
				const res = await this.$request({
					url: this.$apiSol.user.user_info,
					method: 'get'
				})
				// console.log("xxxxxxxxx",res.data.agentuser.user_id);

				this.userid = res.data.options.user_id

			},
			// 判断是否本人
			checkUser() {
				if (Number(this.userid) !== Number(this.solist.user_id)) {
					this.changeBg = false
					// console.log(this.solist,"mmmmmmmmmmmmmmmmmmmmmm");
					// console.log("aaaaa",this.changeBg,this.userid,this.solist.user_id);
				} else {
					this.changeBg = true
					// console.log("bbbbbbbbbbbbbbbbbbbb");
				}
			},
			// 打开物品详情
			showDetail(item) {
				this.goodsDetail = {}
				this.showdetail = true
				this.goodsDetail = item
				// console.log(this.goodsDetail);

			},
			// 获取轮播图
			async gotoPic() {
				const res = await this.$request({
					url: this.$apiSol.navs.index,
					method: 'get',
					data: {
						id: 28,
					}
				})
				// console.log("eeeeeeeeee", res)
				this.swiperList = res.data.list[110].subnav
				this.btnArr.push(res.data.list[164])
				this.btnArr.push(res.data.list[165])
			},
			// 跳转购物车
			gotoOrder() {
				uni.navigateTo({
					url: "/plugins/mch_solitaire/order/index/index" +
						"?mch_id=" +
						this.solist.mch_id,
				});
			},
			getTime(item, newValue) {
				newValue = newValue - 1;
				// console.log(item, newValue, 'newenValuhs');
				/* this.day = parseInt(newValue / 3600 / 24);
				this.hour = parseInt(newValue / 3600 % 24);
				this.minute = parseInt(newValue / 60 % 60);
				this.second = parseInt(newValue % 60); */
				clearInterval(item.msdetail.time);
				item.msdetail.time = setInterval(() => {
					// console.log(newValue, 'newenValuhs**************');
					newValue = newValue - 1;
					if (newValue < 0) {
						clearInterval(item.msdetail.time);
						if (item.msdetail.miaosha_status == 1) {
							item.msdetail.miaosha_status = 0;
							this.reducenum(item);
						}
					}
					// this.day = parseInt(newValue / 3600 / 24);
					// this.hour = parseInt(newValue / 3600 % 24);
					// this.minute = parseInt(newValue / 60 % 60);
					// this.second = parseInt(newValue % 60);
				}, 1000);
			},
			/* getTime(newValue) {
				newValue = newValue - 1;
				this.day = parseInt(newValue / 3600 / 24);
				this.hour = parseInt(newValue / 3600 % 24);
				this.minute = parseInt(newValue / 60 % 60);
				this.second = parseInt(newValue % 60);
				clearInterval(this.time);
				this.time = setInterval(() => {
					newValue = newValue - 1;
					if (newValue < 0) {
						clearInterval(this.time);
						if (this.miaosha_status == 1) {
							this.miaosha_status = 0
						}
					}
					this.day = parseInt(newValue / 3600 / 24);
					this.hour = parseInt(newValue / 3600 % 24);
					this.minute = parseInt(newValue / 60 % 60);
					this.second = parseInt(newValue % 60);
				}, 1000);
			}, */
			/* countdown(t) {
				let time = new Date(t.replace(/-/g, '/'));
				let nowTime = new Date();
				let equation = time.getTime() - nowTime.getTime();
				let day = parseInt((equation / 3600000 / 24));
				let hour = parseInt((equation / 1000 / 60 / 60) % 24);
				let minute = parseInt((equation / 1000 / 60) % 60);
				let second = parseInt((equation / 1000) % 60);
				this.time_str = {
					day: day < 10 ? `0${day}` : day,
					hou: hour < 10 ? `0${hour}` : hour,
					min: minute < 10 ? `0${minute}` : minute,
					sec: second < 10 ? `0${second}` : second
				}
				this.down_time = setTimeout(() => {
					this.countdown(t);
				}, 1000);
			}, */
			genposter() {
				this.isshowqr = true;
				let qjlshare = {
					bg_url: "https://wechatshop.shuangxitang.cn/web//statics/img/mall/poster_bg.png",
				};
				// let spath = 'plugins/mch_solitaire/solitaire/solitaire'solist.content
				let spath = "plugins/mch_solitaire/solitaire/solitaire";
				let scence = this.qjl_id + ',';
				if (this.distrid) {
					scence = this.qjl_id + "," + this.distrid;
				}
				// console.log(this.solist);

				let usershare = [{
						name: "",
						url: this.solist.user.userInfo.avatar,
						stream: 0,
						left: 35,
						top: 35,
						right: 0,
						bottom: 0,
						width: 86,
						height: 86,
						radius: 10,
						opacity: 100,
					},
					{
						name: "",
						url: this.goodslist[0].detail.cover_pic,
						stream: 0,
						left: 35,
						top: 160,
						right: 0,
						bottom: 0,
						width: 680,
						height: 680,
						radius: 10,
						opacity: 100,
					},
					{
						name: "小程序码",
						url: spath,
						stream: scence,
						left: 480,
						top: 1072,
						right: 0,
						bottom: 0,
						width: 220,
						height: 220,
						radius: 0,
						opacity: 100,
					},
				];


				// 获取最高价钱价钱
				var priceArr = []
				this.goodslist.map(item => {
					if (item.detail.min_price) {
						if (item.detail.min_price != item.detail.max_price) {
							priceArr.push(item.detail.max_price)
						} else {
							priceArr.push(item.detail.min_price)
						}
					} else if (item.detail.price_min) {
						if (item.detail.price_max != item.detail.price_min) {
							priceArr.push(item.detail.price_max)
						} else {
							priceArr.push(item.detail.price_min)
						}
					} else {
						priceArr.push(item.detail.price)
					}
				})
				var maxPrice = Math.max.apply(null, priceArr);
				var minPrice = Math.min.apply(null, priceArr);
				var price
				if (maxPrice == minPrice) {
					price = minPrice
				} else {
					price = minPrice + "-" + maxPrice
				}



				qjlshare.image = usershare;
				qjlshare.text = [{
						text: this.solist.user.nickname.length > 14 ?
							this.solist.user.nickname.slice(0, 14) + "…" : this.solist.user.nickname,
						left: 140, // 500 400
						top: 48 + 12,
						fontSize: 24,
						fontColor: "0,0,0",
						angle: 0,
					},
					{
						text: this.solist.created_at,
						left: 140, // 500 400
						top: 100 + 9,
						fontSize: 18,
						fontColor: "155,155,155",
						angle: 0,
					},
					{
						text: this.solist.title,
						left: 35,
						top: 886 + 15,
						width: 680,
						// height: 960,
						fontSize: 30,
						fontColor: "0,0,0",
						angle: 0,
					},
					// 接龙详情显示 11-29取消
					// {
					// 	text: this.solist.content,
					// 	left: 35,
					// 	top: 980 + 12,
					// 	width: 680,
					// 	fontSize: 24,
					// 	fontColor: "155,155,155",
					// 	angle: 0,
					// },
					{
						text: "￥" + price,
						left: 35,
						top: 1170 + 18,
						fontSize: 36,
						fontColor: "9,186,7",
						angle: 0,
					},
				];

				this.$request({
						url: this.$apiSol.generate.aposter,
						method: "post",
						header: {
							"content-type": "application/json",
						},
						data: qjlshare,
					})
					.then((res) => {
						this.qrimg = res.imgurl;
						/* return {
						title: 'niaho',
						path: spath,
						imageUrl: res.imgurl
					} */
					})
					.catch(() => {});
			},
			saveposter() {
				this.$utils.batchSave(this.qrimg, "image").then(() => {
					this.isshowqr = false;
					uni.showToast({
						title: "保存成功",
					});
				});
			},
			toMap() {
				// console.log(this.solist);
				uni.openLocation({
					latitude: parseFloat(this.solist.mch.store.latitude),
					longitude: parseFloat(this.solist.mch.store.longitude),
					name: this.solist.mch.store.name,
					address: this.solist.mch.store.address,
					success: (res) => {
						// console.log(res, 'weizhixinix');
					},
				});
			},
			tomoremegoods() {},
			storeupdown() {
				this.$request({
						url: this.$api.apply.list,
						data: {
							page: 1,
							limit: 5,
							review_status: 1,
							keyword: "random",
						},
					})
					.then((res) => {
						this.avaterimg = res.data.list;
					})
					.catch((err) => {
						// console.log(err);
					});
			},
			onReq(kid) {
				this.$request({
						url: this.$apiSol.navs.catedetail,
						data: {
							keyword: kid,
						},
					})
					.then((res) => {
						if (kid == 29) {
							this.imglist = res.data.list[0].icon_url;
						}
						if (kid == 30) {
							this.advimg = res.data.list[0].icon_url;
						}
					})
					.catch(() => {});
			},
			onAllReq(kid) {
				// console.log("888888888888888888888888888888");
				this.$request({
						url: this.$apiSol.navs.list,
						data: {
							pid: kid,
						},
					})
					.then((res) => {
						if (kid == 31) {
							// console.log(res, 'kid===30')
							this.fourbtn = res.data.list;
						}
					})
					.catch(() => {});
			},
			back() {
				let pages = getCurrentPages();
				// console.log(pages);
				if (pages.length == 1) {
					uni.redirectTo({
						url: "/plugins/mch_solitaire/index/index",
					});
				} else if (pages.length > 1) {
					uni.navigateBack();
				}
			},
			toMchlist() {
				uni.navigateTo({
					url: "/plugins/mch_solitaire/solist/solist?lauser_id=" +
						this.solist.user_id +
						"&mcha=" +
						this.solist.mch.id,
				});
			},
			addSelect(selattr, number) {
				// this.$refs.stgoods.display = "none"
				this.cartnum = this.cartnum + Number(number);
				this.cartprice = Number(this.cartprice) + Number(selattr.price);
				// this.cartprice.toFixed(2)
				// console.log(this.cartnum, 'cur');
				// cartgoods.push()
				// this.cu
				// console.log(this.goodslist);
				// console.log(selattr, number, 'selartrrnumberkkk');
				this.goodslist = this.goodslist.map((item, index) => {
					// console.log(item, '998874178');

					if (
						(item.detail.sign == "mch" &&
							item.detail.goods_warehouse.goods_id == selattr.goods_id) ||
						item.detail.goods_warehouse_id == selattr.goods_id ||
						item.detail.id == selattr.goods_id
					) {
						item.ispechoice = true; // 是否选择规格
						item.specnum = number; // 当前选择数量
						item.price = selattr.price; // 当前选择规格价格
						item.attname = selattr.attr_list[0].attr_name; // 当前选择规格名称
						item.stock = selattr.stock; // 当前选择规格库存
						item.attrs = selattr.attr_list; // 当前选择规格
						item.id = selattr.goods_id; // 当前选择商品id
						item.goods_attr_id = selattr.id; // 当前规格id
					}
					return item;
				});
				this.cartsgoods = this.goodslist.filter((item) => {
					return item.ispechoice;
				});
				// console.log(this.cartgoods, 'cadssssssssssss');
				/* this.goodslist.map(item => {
					if (item.specnum) {
						this.cartnum = this.cartnum + Number(item.specnum)
						console.log(this.cartnum, 'cur');
					}
				}) */

				// this.cartgoods = this.goodslist.map((item, index) => {
				// 	if (item.ispechoice == true) {
				// 		return item
				// 	}
				// })
				// console.log(this.cartgoods, '打算购买的商品');
				// console.log(this.goodslist);
			},
			tomoreuser() {
				this.page++;
				this.moreloading = true;
				this.initQunuser();
			},
			initQunuser() {
				let self = this;
				self
					.$request({
						url: self.$apiSol.solitaire.userlist,
						data: {
							qjlid: self.qjl_id,
							page: self.page,
							// pageSize: self.pageSize
						},
					})
					.then((res) => {
						// console.log(res);
						self.moreloading = false;
						self.souserlist = self.souserlist.concat(res.data.list);
						self.pagecount = res.data.pagination.page_count;
						self.totalcount = res.data.pagination.total_count;
					})
					.catch((err) => {
						self.moreloading = false;
					});
			},
			// 规格选择
			check(obj) {
				// console.log(obj, 'obj');
				this.checked = obj;
			},

			// 底部四个跳转的方法
			jump(item) {
				// console.log(item);mch_id=18&lauser_id=88&ismineso=true&mcha=17
				console.log(item, 'aaaaaaaaaaa')
				if (item.id == "32") {
					uni.switchTab({
						url: item.url
					})
				} else {
					// console.log("xxxxmch_id",this.solist.mch_id);

					let mchid = this.solist.mch_id
					uni.navigateTo({
						url: item.url +
							"?mcha=" +
							mchid +
							"&lauser_id=" +
							this.solist.user_id,
					});
				}

			},
			jumpTo(url) {
				uni.redirectTo({
					url: url,
				});
			},
			routeGo() {
				uni.navigateTo({
					url: "/plugins/mch_solitaire/goods/addgoods",
				});
			},
			addspecnum(item) {
				item.ispechoice = !item.ispechoice;
				// this.$set('cartnum', this.cartnum)

				this.$forceUpdate();
			},
			reducenum(item) {
				item.specnum--;
				this.cartnum = this.cartnum - 1;
				this.cartprice = Number(this.cartprice) - Number(item.price);
				// this.cartprice.toFixed(2)
				// console.log(this.cartnum, 'console.log(this.cartnum);');
				// this.$set('cartnum', this.cartnum)
				if (item.specnum == 0) {
					item.ispechoice = false;
				}
				this.cartsgoods = this.cartsgoods.filter((item) => {
					return item.ispechoice == true;
				});
				// console.log(this.cartsgoods, 'colofjhdddddddd');
				this.$forceUpdate();
				/* else {
					item.specnum--
				} */
			},
			reducecartsnum(item) {
				item.specnum--;
				this.cartnum = this.cartnum - 1;
				this.cartprice = Number(this.cartprice) - Number(item.price);

				if (item.specnum == 0) {
					item.ispechoice = false;
				}
				this.cartsgoods = this.cartsgoods.filter((item) => {
					return item.ispechoice == true;
				});
				// console.log(this.cartsgoods, 'reducecartsnum2222222333333');
				this.$forceUpdate();
			},
			addnum(item) {
				// console.log('nnnkkkkoiiooo');
				// console.log(item.stock);
				if (item.stock <= item.specnum) {
					uni.showToast({
						title: "当前选择数量超过库存",
						icon: "none",
					});
					return;
				}
				item.specnum++;
				this.cartnum = this.cartnum + 1;
				this.cartprice = Number(this.cartprice) + Number(item.price);
				// this.cartprice.toFixed(2)
				// console.log(this.cartnum, 'console.log(this.cartnum);');
				// console.log(item.specnum);
				this.$forceUpdate();
			},
			addattrshow(item) {
				// 选择规格
				// console.log(item);
				// item.detail = item.detail
				// item.attrShow = !item.attrShow
				this.cugoods.detail = item.detail;
				this.cugoods.attrShow = Math.random();
				// console.log(item.attrShow);
			},
			tosolitaire() {
				// 结算
				// console.log(this.isTop);
				if (!this.isTop) {
					uni
						.createSelectorQuery()
						.select(".list-two")
						.boundingClientRect((data) => {
							//目标位置的节点：类或者id
							uni
								.createSelectorQuery()
								.select(".con-box")
								.boundingClientRect((res) => {
									//目标位置的节点：类或者id
									// console.log(res);
									uni.pageScrollTo({
										duration: 100, //过渡时间
										scrollTop: data.top - res.top, //到达距离顶部的top值
									});
									this.isTop = true;
								})
								.exec();
						})
						.exec();
				}
				if (
					this.$store.state.user.accessToken === "" ||
					this.$store.state.user.accessToken === null
				) {
					this.$store.dispatch("user/accessToken");
					return;
				}
				this.cartgoods = this.goodslist.filter((item, index) => {
					return item.ispechoice == true;
				});
				if (this.cartgoods.length == 0) {
					uni.showToast({
						title: "请先选择想要接龙的商品",
						icon: "none",
					});
					return;
				}
				// 多个商品多个订单
				let agods = [];
				agods = this.cartgoods.map((item) => {
					let itemd = {
						mch_id: item.detail.mch_id,
						goods_list: [{
							id: item.id,
							attrs: item.attrs,
							mch_id: item.detail.mch_id,
							num: item.specnum,
							cat_id: 0,
							goods_attr_id: item.goods_attr_id,
							cart_id: 0,
						}, ],
					};
					return itemd;
				});
				let angods = agods;
				// 多个商品单个订单
				/* let agods = []
				agods = this.cartgoods.map(item => {
					let itemd = {
						id: item.id,
						attrs: item.attrs,
						mch_id: item.detail.mch_id,
						num: item.specnum,
						cat_id: 0,
						goods_attr_id: item.goods_attr_id,
						cart_id: 0
					}
					return itemd
				})
				let angods = [{
					// mch_id: this.mch_id,
					mch_id: this.buy_mch_id,
					goods_list: agods
				}] */
				// console.log(agods, this.cartgoods, this.goodslist, '所以水水水水水');
				/* if (!isgoods) {
					console.log('*****7777777')
					uni.showToast({
						title: '请先选择接龙商品',
						icon: 'none'
					})
					return
				} */
				if (
					this.$store.state.user.accessToken === "" ||
					this.$store.state.user.accessToken === null
				) {
					this.$store.dispatch("user/accessToken");
					return;
				}
				this.allprice = 0;
				let pricelist = [];
				pricelist = this.goodslist.map((item) => {
					if (item.ispechoice) {
						return item.price * item.specnum;
					}
				});
				pricelist.forEach((item) => {
					if (item != undefined) {
						this.allprice = Number(this.allprice) + Number(item);
					}
				});
				// console.log(this.allprice, this.buy_mch_id);
				/* let isgoods = this.list.childgoodlist.some(item => {
					return item.ispechoice
				}) */

				uni.navigateTo({
					url: "/plugins/mch_solitaire/order-submit/order-submit?mch_list=" +
						JSON.stringify(angods) +
						"&mch_id=" +
						this.buy_mch_id +
						"&qjl_id=" +
						this.qjl_id + "&share_id=" + this.shareId,
				});
			},
		},
	};
</script>

<style scoped lang="scss">
	.con-box {
		width: 100%;
		padding-bottom: 1px;
		background: #f2f2f2;
	}

	/deep/.con-box .list-two:first-child {
		border-top: none !important;
	}

	.top-navbox {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		padding: 12px 0 0 24rpx;
		background-color: #fff;
		z-index: 1;
	}

	.top-nav {
		font-size: 28rpx;

		.back-img {
			width: 18rpx;
			height: 32rpx;

			// .imhg {
			// 	width: 36rpx;
			// 	height: 36rpx;
			// }
		}

		>.nav-text {
			margin-left: 24rpx;
		}
	}

	.top-bg-nav {
		position: absolute;
		top: 24rpx;
		right: 24rpx;
		font-size: 28rpx;
		height: 72rpx;
		line-height: 72rpx;
		display: flex;
		flex-direction: column;
		z-index: 2;
		.back-img {
			width: 18rpx;
			height: 32rpx;

			// .imhg {
			// 	width: 36rpx;
			// 	height: 36rpx;
			// }
		}

		>.nav-text {
			margin-left: 24rpx;
		}
	}

	.rota {
		position: absolute;
		top: 24rpx;
		left: 24rpx;
		width: 300rpx;
		height: 72rpx;
		z-index: 0;
		background: rgba(0, 0, 0, 0.5);
		font-size: 24rpx;
		line-height: 72rpx;
		text-align: center;
		border-radius: 50rpx;
		box-shadow: 0 1rpx 3rpx rgba(0, 0, 0, 0.2);
		padding: 0 24rpx;
		z-index: 2;
		opacity: 0.6;
		color: #ffffff;

		.imgag {
			width: 48rpx;
			height: 48rpx;
			border-radius: 50rpx;
			margin: 0 12rpx;
		}
	}

	.per-info {
		width: 100%;
		height: 136rpx;
		padding: 18rpx 26rpx 0rpx 32rpx;
		background: #f2f2f2;
		z-index: 0;
		position: sticky;
		margin-top: -18rpx;
		border-radius:24rpx 24rpx  0 0 ;
		display: flex;
		justify-content: space-between;
		.userInfo{
			position: sticky;
			margin-top: -42rpx;
			image{
				width: 120rpx;
				height: 120rpx;
				border-radius: 8rpx;
				opacity: 1;
			}
			.userName > view{
				font-size: 30rpx;
				font-weight: 800;
			}
		}
		// 小头像
		.avatarUser{
			display: flex;
			width: 320rpx;
			align-items: center;
			height: 80rpx;
			image{
				width: 50rpx;
				height: 50rpx;
				background: #f37b1d;
				border-radius: 4rpx;
			}
			.fontview{
				width:150rpx;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				font-size: 22rpx;
				margin-left: 10rpx;
			}
		}
		.sharebtn{
			display: flex;
			width: 134rpx;
			justify-content: space-between;
			.sDbtn{
				display: flex;
				flex-direction: column;
				image{
					width: 44rpx;
					height: 44rpx;
				}
				text{
					font-size: 22rpx;
					color: #999999;
				}
			}
		}
	}

	.qun-detail {
		width: 100%;
		background-color: #fff;
		padding: 32rpx;
		// margin: 24rpx auto;
	}

	.all-box {
		// width: 702rpx;
		// margin: 0 auto;
		width: 100%;
		padding: 0 24rpx;
		background-color: #ffffff;
		font-size: 28rpx;
		line-height: 60rpx;

		.cla-item {
			padding: 0 24rpx;
		}
	}

	.rea-advimg {
		margin: 24rpx auto;
		width: 702rpx;
	}

	.reatime {
		margin-top: 30rpx;
		margin-left: 24rpx;
		display: flex;
		position: relative;
		align-items: center;
		min-height: 100rpx;

		.text-orange {
			display: inline-block;
			background: #f37b1d;
			width: 8rpx;
			height: 28rpx;
		}

		.action {
			margin-left: 30rpx;
			font-size: 30rpx;
			margin-right: 30rpx;
		}
	}

	.rea-solitaire {
		padding: 24rpx;

		.publisher {
			display: flex;
			padding-right: 10rpx;
			height: 140rpx;
			background-color: #ffffff;
			align-items: center;
			z-index: 2;
			.avatar {
				width: 128rpx;
				height: 128rpx;
				border-radius: 50%;
			}

			.content {
				width: calc(100% - 96rpx - 60rpx - 20rpx);
				font-size: 26rpx;
			}

			.create-time {
				font-size: 24rpx;
				color: #aaaaaa;
			}
		}
	}

	.rea-soitem {
		margin: 24rpx auto;
		z-index: 2;
		width: 702rpx;
		border-radius: 16rpx;
		background: #ffffff;
		padding: 24rpx;
	}

	.rea-soitem1 {
		margin: 24rpx auto 128rpx;
		margin: 24rpx auto calc(128rpx + constant(safe-area-inset-bottom));
		margin: 24rpx auto calc(128rpx + env(safe-area-inset-bottom));
	}

	.rea-solitem {
		font-size: 24rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		text-align: center;

		.rea-solitem-img {
			width: 52rpx;
			height: 52rpx;
			align-self: center;
		}
	}

	.resa-title {
		font-size: 32rpx;
		font-weight: 600;
	}

	.resa-content {
		font-size: 28rpx;
		color: #b0b0b0;
		margin-bottom: 12rpx;
	}

	.rea-content {
		font-size: 28rpx;

		.b-image {
			width: 100%;
			height: 200rpx;
		}
	}

	.rea-btn {
		// position: fixed;
		// bottom: 24rpx;
		// left: 24rpx;
		// width: 702rpx;
		text-align: center;
		line-height: 80rpx;
		color: #ffffff;
		background-color: $uni-bgcolor;
		border-radius: 72rpx;
		margin: 24rpx auto;
	}

	.solitaireor {
		font-size: 28rpx;

		.so-item {
			display: flex;
			align-items: center;
			margin: 32rpx auto;
			font-weight: 600;

			.so-index {
				margin-right: 16rpx;
			}

			.so-avatar {
				width: 56rpx;
				height: 56rpx;
				border-radius: 50%;
			}

			.so-content {
				font-size: 24rpx;
				display: flex;
				justify-content: space-between;
				flex: 1;
				align-items: center;

				.so-ava {
					padding: 0 24rpx;
				}
			}
		}

		.moreuser {
			font-size: 24rpx;
			text-align: center;
		}
	}

	.soli-else {
		font-size: 28rpx;
		color: #888888;
		text-align: center;
		line-height: 60rpx;
	}

	.discuss {
		.discuss-item {
			font-size: 28rpx;
			display: flex;

			.dis-avatar {
				width: 96rpx;
				height: 96rpx;
				border-radius: 16rpx;
			}

			.dis-content {
				.dis-name {
					line-height: 76rpx;
					font-size: 28rpx;
					color: #888888;
				}

				.dis-dec {
					font-size: 28rpx;
				}
			}
		}
	}

	.sol-address {
		font-size: 24rpx;
		padding: 12rpx 24rpx;
		border-radius: 32rpx;
	}

	.list-two {
		width: 100%;

		.list-two-item {
			display: flex;
			// align-items: center;
			justify-content: space-between;
			// margin: 0 auto;
			width: 100%;
			height: 220rpx;
			font-size: 28rpx;
			padding: 6rpx;
			border-top: 1rpx solid rgb(241, 241, 241);

			&+.list-two-item {
				margin-top: 24rpx;
			}

			.list-two-image {
				width: 210rpx;
				height: 210rpx;
				position: relative;

				.list-two-miaosha {
					position: absolute;
					bottom: 0;
					left: 0;
					width: 216rpx;
					height: 30rpx;
					color: #fff;
					font-size: 16rpx;
					text-align: center;
					line-height: 30rpx;
				}
			}

			.image {
				width: 212rpx;
				height: 212rpx;
			}

			.list-two-title {
				flex: 1;
				// margin-left: 36rpx;
				text-align: justify;
				margin-right: 24rpx;
				line-height: normal;
				padding: 40rpx 0;
			}

			.list-two-subtitle {
				flex: 1;
				text-align: justify;
				margin-right: 24rpx;
				color: #b0b0b0;
			}
		}
	}

	.rea-price {
		font-size: 24rpx;
		color: #fa5151;
		// padding-left: 24rpx;
	}

	.rea-spec {
		font-size: 24rpx;
		color: #666666;
		padding-left: 12rpx;
	}

	.spechoi {
		align-self: flex-end;

		.spechoice {
			display: flex;
			align-items: center;
		}

		.specn {
			margin: 0 36rpx;
		}
	}

	.rea-reduce {
		width: 48rpx;
		height: 48rpx;
		border-radius: 50%;
		color: #fff;
		background-color: #E4432E;
		text-align: center;
		line-height: 36rpx;
		position: relative;

		&.failed {
			background-color: #dcdcdc;
		}

		&::before {
			content: "";
			width: 28rpx;
			height: 4rpx;
			background-color: #fff;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}
	}

	.rea-plus {
		width: 48rpx;
		height: 48rpx;
		border-radius: 50%;
		color: #fff;
		background-color: $uni-bgcolor;
		text-align: center;
		line-height: 36rpx;
		position: relative;

		&.failed {
			background-color: #dcdcdc;
		}

		&::before {
			content: "";
			width: 28rpx;
			height: 4rpx;
			background-color: #fff;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

		&::after {
			content: "";
			width: 4rpx;
			height: 28rpx;
			background-color: #fff;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}
	}

	.rea-icon {
		transform: rotate(45deg);
		/* background-image: url("../../../static/image/cart/can-add.png");
		width: 36rpx;
		height: 36rpx;
		background-repeat: no-repeat;
		display: block;
		background-size: 100% 100%; */
	}

	.rea-choice {
		padding: 6rpx 12rpx;
		background-color: $uni-bgcolor;
		border-radius: 64rpx;
		color: #ffffff;
	}

	.step-carts {
		width: 100%;
		height: 88rpx;
		text-align: center;

		.step-carts-price {
			width: auto;
			border-radius: 54rpx;
			line-height: 80rpx;
			padding: 0 6rpx;
			background: #fff;
			color: $uni-bgcolor;
			border: 1rpx solid;
			margin-right: 24rpx;
		}

		.step-carts-icon {
			width: 80rpx;
			height: 80rpx;
			color: #ffffff;
			background-color: $uni-bgcolor;
			border-radius: 50%;
			margin-right: 24rpx;
			position: relative;

			.step-carts-icon-img {
				width: 80rpx;
				height: 80rpx;
				border-radius: 50%;
			}

			.step-carts-cartnum {
				position: absolute;
				top: -10rpx;
				right: -18rpx;
				border-radius: 36rpx;
				min-width: 40rpx;
				height: 40rpx;
				line-height: 40rpx;
				padding: 0 6rpx;
				background-color: $uni-bgcolor;
				font-size: 24rpx;
				color: #fff;
			}
		}
	}

	.step-dragon {
		text-align: center;
		color: #ffffff;
		background-color: $uni-bgcolor;
		flex: 1;
		display: flex;
		flex-direction: column;
		justify-content: space-evenly;
		align-items: center;
	}

	.step-popup {
		position: relative;
		z-index: 8;
	}

	.share-popup {
		position: relative;
		z-index: 10;

		.share-btn {
			width: 100%;
			// height: 120rpx;
			padding: 0;
			margin: 0;
			border: none;
			font-size: 28rpx;

			&::after {
				width: 100%;
				height: 100%;
				border: none;
			}
		}

		.sharecancel {
			height: #{110rpx};
			width: 100%;
			font-size: $uni-font-size-general-one;
			text-align: center;
		}
	}

	.poster-popup {
		position: relative;
		z-index: 12;

		.postercancel {
			text-align: right;
		}

		.posterbtn {
			height: #{70rpx};
			width: 520rpx;
			font-size: $uni-font-size-general-one;
			text-align: center;
			color: #fff;
			margin-top: 32rpx;
		}
	}

	.fmodel {
		height: 836rpx;
		width: 100%;

		.f-top {
			height: 100rpx;
			border-bottom: 1upx solid #ececec;
			padding-left: 24upx;
			background-color: #ffffff;
			border-radius: 32rpx 32rpx 0 0;
			font-size: 30rpx;

			.f-image {
				width: 78upx;
				height: 78upx;
				padding: 24upx;

				.f-img {
					width: 24upx;
					height: 24upx;
				}
			}
		}

		.scroll-fc {
			display: flex;
			align-items: center;
			font-size: 28rpx;
			height: 80rpx;
			line-height: 60rpx;
			margin-top: 10rpx;
		}

		.cl-scroll {
			// width: 100%;
			padding: 0 24rpx;
			height: 80rpx;
			white-space: nowrap;

			.cl-item {
				padding: 0 24rpx;
				display: inline-flex;
			}
		}

		.cl-item-active {
			color: #ffffff;
			background-color: #353535;
		}

		.f-scroll {
			height: 736upx;
			// height: 624upx;
			// height: 560rpx;
			width: 100%;
			// padding: 24rpx;
			padding-left: 24rpx;
			padding-right: 24rpx;
			padding-top: 24rpx;
			background-color: #ffffff;
			font-size: 30rpx;
			padding-bottom: 152rpx;

			.f-scroll-content {
				padding: 0 24upx;
				height: 995upx;
				width: 100%;
			}

			.f-item {
				width: 702upx;
				height: 100upx;
				// border: 1upx solid #cfcfcf;
				// margin-top: 17upx;
				text-align: center;
			}

			.f-item:last-child {
				// margin-bottom: 24upx;
			}

			.f-item-top {
				height: 159upx;
				position: relative;

				>image {
					height: 159upx;
					width: 100%;
				}

				>view {
					position: absolute;
					top: 0;
					width: 702upx;
					height: 159upx;
					padding: 0 24upx;
					color: #ffffff;
				}

				.dir-left-nowrap>button {
					width: 161upx;
					height: 56upx;
					line-height: 56upx;
					padding: 0;
					border: none;
					margin: 0;
					border-radius: 28upx;
					background-color: #ffffff;
					font-size: 26upx;
					text-align: center;

				}

				.f-text-content {
					padding-bottom: 25upx;
				}

				.f-big-text-dis text {
					line-height: 1;
				}

				.f-big-text-dis text:first-child {
					font-size: 56upx;
					font-weight: bold;
				}

				.f-big-text-dis text:last-child {
					font-size: 34upx;
					margin-left: 14upx;
				}

				.f-small-text {
					font-size: 24upx;
					margin-left: 27upx;
					// color: rgb(255, 255, 255);
				}

				.f-big-text-pri text {
					line-height: 1;
				}

				.f-big-text-pri text:first-child {
					font-size: 27upx;
				}

				.f-big-text-pri text:last-child {
					font-size: 56upx;
					font-weight: bold;
				}
			}

			.f-item-bottom {
				height: 111upx;
				padding: 24upx;

				text {
					font-size: 22upx;
					color: #545454;
				}
			}
		}
	}

	// 详情展示界面

	// 购物车底层
	.cart-body {
		position: fixed;
		bottom: 0;
		width: 100%;
		display: flex;
		flex-direction: column;
		height: 138rpx;
		justify-content: space-between;
		z-index: 9;
	}

	.jbdikou {
		color: #fa5151;
		font-size: 24rpx;
	}

	// 图标样式
	.step-order {
		width: 15%;
		height: 100%;
		background: white;

		.orderimage {
			color: #7c7c7c;
			display: flex;
			flex-direction: column;
			background: white;
			height: 100%;
			justify-content: center;
			font-size: 28rpx;
			align-items: center;
			position: relative;

			.step-carts-cartnum {
				position: absolute;
				top: -10rpx;
				right: 0rpx;
				border-radius: 36rpx;
				min-width: 40rpx;
				height: 40rpx;
				line-height: 40rpx;
				padding: 0 6rpx;
				background-color: $uni-bgcolor;
				font-size: 24rpx;
				color: #fff;
			}

			image {
				height: 50%;
				width: 35%;
			}
		}



	}
</style>
